<%@ page contentType="text/html;charset=UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<c:set var="ctx" value="${pageContext.request.contextPath}"/>
<%@ taglib prefix="shiro" uri="http://shiro.apache.org/tags" %>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <script src="${ctx}/static/h5/js/public/loginFilter.js"></script>
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <link rel="stylesheet" href="${ctx}/static/h5/css/public/bootstrap.min.css" type="text/css">
    <link rel="stylesheet" href="${ctx}/static/h5/css/personal/index.css" type="text/css">
    <title>我的家族</title>
</head>
<body id="ancestor">
<header class="header">
    <h4>${familyName}</h4>
    <img src="${ctx}/static/h5/images/forDown.png" alt="下拉" class="forDown" class="dropdown-toggle" id="dropdownMenu" data-toggle="dropdown" >
    <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1">
        <c:forEach var="li" items="${families}">
            <li role="presentation" class="familyperson">
                <a role="menuitem" tabindex="-1" href="#" class="name">
                        ${li.ffName}
                </a>
                <input hidden="hidden" class="familyId" value="${li.ffId}" />
            </li>
        </c:forEach>
    </ul>
    <%--<div class="header-img dropdown">--%>
        <%--<a href="/h5/family/seache"><img src="${ctx}/static/h5/images/seacher.png" alt=""/></a>--%>
        <%--<img src="${ctx}/static/h5/images/add1.png" class="dropdown-toggle" id="dropdownMenu" data-toggle="dropdown" alt=""/>--%>
        <%--<ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1">--%>
            <%--<li role="presentation">--%>
                <%--<a role="menuitem" tabindex="-1" href="#">--%>
                    <%--<img src="${ctx}/static/h5/images/add-friend.png" alt=""/>家族列表--%>
                <%--</a>--%>
            <%--</li>--%>
            <%--<li role="presentation" onclick="clicked('/h5/family/barcode',true,true);">--%>
                <%--<a role="menuitem" tabindex="-1" href="#">--%>
                    <%--<img src="${ctx}/static/h5/images/saoyisao.png" alt=""/>扫一扫--%>
                <%--</a>--%>
            <%--</li>--%>
        <%--</ul>--%>
    <%--</div>--%>
    <div class="header-img dropdown">
        <a href="/h5/family/seache"><img src="${ctx}/static/h5/images/seacher.png" alt=""/></a>
        <%--<img src="${ctx}/static/h5/images/add2.png" alt=""/>--%>
    </div>
</header>
<section class="tab-content tab-content-section">
    <div id="family" class="tab-pane fade in active">
        <ul class="family-ul">
            <c:if test="${!empty show}">
            <li>
                <a href="/h5/family/fapply" class="fapply">
                    <img src="${ctx}/static/h5/images/family_applay.png" alt=""/>
                    <span class="span-content">家族成员申请</span>
                    <img src="${ctx}/static/h5/images/tiaozhuan.png" class="tiaozhuan" alt=""/>
                </a>
            </li>
            </c:if>
            <li>
                <a href="" class="shares">
                    <img src="${ctx}/static/h5/images/index_share.png" alt=""/>
                    <span class="span-content">分享</span>
                    <img src="${ctx}/static/h5/images/tiaozhuan.png" class="tiaozhuan" alt=""/>
                </a>
            </li>
            <li>
                <a href=" " class="fcircle">
                    <img src="${ctx}/static/h5/images/family_circle.png" alt=""/>
                    <span class="span-content">家族动态（五服之内）</span>
                    <img src="${ctx}/static/h5/images/tiaozhuan.png" class="tiaozhuan" alt=""/>
                </a>
            </li>
            <li>
                <a href=" " class="note"><%--home?fId=1&tagId=2--%>
                    <img src="${ctx}/static/h5/images/index_note.png" alt=""/>
                    <span class="span-content">大事记</span>
                    <img src="${ctx}/static/h5/images/tiaozhuan.png" class="tiaozhuan" alt=""/>
                </a>
            </li>
            <li>
                <a href="/h5/family/tree?fId=1" class="familys">
                    <img src="${ctx}/static/h5/images/family_tree.png" alt=""/>
                    <span class="span-content">家族树</span>
                    <img src="${ctx}/static/h5/images/tiaozhuan.png" class="tiaozhuan" alt=""/>
                </a>
            </li>
            <li>
                <a href="/h5/family/familybook">
                    <img src="${ctx}/static/h5/images/family_book.png" alt=""/>
                    <span class="span-content">家谱</span>
                    <img src="${ctx}/static/h5/images/tiaozhuan.png" class="tiaozhuan" alt=""/>
                </a>
            </li>
            <li>
                <a href="/h5/family/familydatas" class="familydatas">
                    <img src="${ctx}/static/h5/images/family_data.png" alt=""/>
                    <span class="span-content">家族数据</span>
                    <img src="${ctx}/static/h5/images/tiaozhuan.png" class="tiaozhuan" alt=""/>
                </a>
            </li>
            <li>
                <a href="/h5/family/familyss" class="familyss">
                    <img src="${ctx}/static/h5/images/family_famouse.png" alt=""/>
                    <span class="span-content">家族名人</span>
                    <img src="${ctx}/static/h5/images/tiaozhuan.png" class="tiaozhuan" alt=""/>
                </a>
            </li>
         <%--   <li>
                <a href="">
                    <img src="${ctx}/static/h5/images/meneger.png" alt=""/>
                    <span>家族管理</span>
                    <img src="${ctx}/static/h5/images/tiaozhuan.png" class="tiaozhuan" alt=""/>
                </a>
            </li>--%>
        </ul>
    </div>
</section>
<footer class="footer">
    <ul class="nav nav-pills">
        <li>
            <a href="/h5/index/home" class="mesager">消息</a>
        </li>
        <li class="active">
            <a href="/h5/family/" class="family">家族</a>
        </li>
        <li>
            <a href="/h5/find/" class="find">发现</a>
        </li>
        <li>
            <a href="/h5/user/mzone" class="myself">我的</a>
        </li>
    </ul>
</footer>
</body>
<script src="${ctx}/static/h5/js/public/jquery-2.2.3.min.js"></script>
<script src="${ctx}/static/h5/js/public/common.js"></script>
<script src="${ctx}/static/h5/js/public/immersed.js"></script>
<script src="${ctx}/static/h5/js/public/bootstrap.min.js"></script>
<script src="${ctx}/static/h5/js/personal/index.js"></script>
<script src="${ctx}/static/h5/js/personal/family.js"></script>
<script>
    $(function () {
        var userId=localStorage.getItem("userId");
        var personId=localStorage.getItem("personId");
        var familyId=${family}
        $(".note").on("click",function(){
            var url="/h5/family/note?familyId="+familyId+"&userId="+userId
            $(this).attr("href",url);
        })
        $(".shares").on("click",function(){
            var url="/h5/family/shares?familyId="+familyId+"&userId="+userId
            $(this).attr("href",url);
        })
        $(".familydatas").on("click",function () {
            var url="/h5/family/familydatas?fId="+familyId;
            $(this).attr("href",url);
        })
        /*
        * 接口改成直接通过家族id查询
        * */
        $(".fcircle").on("click",function () {
            var url="/h5/family/fcircle?familyId="+familyId+"&userId="+userId
            $(this).attr("href",url);
        })
        $(".mesager").on("click",function () {
            var url="";
            if(userId == "" || userId == null){
                url="/h5/user/login";
            }else {
                url="/h5/index/home?userId="+userId
            }
            $(this).attr("href",url);
        })
        //家族
        $(".family").on("click",function () {
            var url="";
            if(userId == "" || userId == null){
                url="/h5/user/login";
            }else {
                url="/h5/family/family?userId="+userId
            }
            $(this).attr("href",url);
        })
        $(".familyss").on("click",function () {
            var url="/h5/family/familyss?id="+userId+"&familyId="+familyId
            $(this).attr("href",url);
        })
        $(".familys").on("click",function () {
            var url="/h5/family/tree?familyId="+familyId+"&personId="+personId
            $(this).attr("href",url);
        })
   /*     $(".fapply").on("click",function () {
            var url="/h5/family/fapply?userId="+userId;
            $(this).attr("href",url);
        })*/
        $(".myself").on("click",function () {
            var url="";
            if(userId == "" || userId == null){
                url="/h5/user/login";
            }else {
                url = "/h5/user/mzone?userId=" + userId
            }
            $(this).attr("href",url);
        })

       $(".familyperson").on("click",function () {
            var id=$(this).children(".familyId").val();
            var url="/h5/family/family?userId="+userId+"&id="+id
            $(this).children(".name").attr("href",url);
       })

    })
</script>
</html>
